<template>
    <view class="login">
        <view class="login_box">
            <text class="title">欢迎进入同汇甄选</text>
            <view
                style="
                    font-size: 20rpx;
                    color: #999;
                    padding-bottom: 130rpx;
                    display: block;
                    padding-top: 20rpx;
                    line-height: 1.2rem;
                "
            >
                为您提供优质服务,百焕商面需要获取以下信息
                <text style="display: block">您的公开信息(昵称、头像)</text>
            </view>
            <button class="login_btn" @click.stop="getPhone" v-if="!isCheck">
                获取手机号一键登录
            </button>

            <button
                class="login_btn"
                v-if="isCheck"
                open-type="getPhoneNumber"
                @getphonenumber="getPhoneNumber"
            >
                获取手机号一键登录
            </button>
            <view class="other_login" style="margin-top: 46rpx">
                <label class="radio">
                    <radio
                        style="margin-right: 10rpx"
                        value="r1"
                        @click.stop="change"
                        :checked="isCheck"
                    />确认同意
                    <text class="xieyi" @click.stop="goXieYi"> &laquo;隐私政策&raquo; </text>
                </label>
            </view>
            <!-- <button class="login_btn" @click="wxLog">微信登录</button> -->
        </view>
    </view>
</template>
<script>
import { BaseUrl } from "../../utils/req.js";
export default {
    data() {
        return {
            code: "",
            BaseUrl: BaseUrl,
            isCheck: false,
        };
    },
    onLoad(options) {
        uni.login({
            success: (res) => {
                this.code = res.code;
            },
        });
    },

    methods: {
        change() {
            this.isCheck = !this.isCheck;
        },
        //协议
        goXieYi() {
            uni.navigateTo({
                url: "/user/pages/protocol",
            });
        },

        wxLog() {
            uni.navigateTo({ url: "/liu/pages/wxLogin" });
        },
        getPhone() {
            if (!this.isCheck) return uni.showToast({ title: "请同意协议", icon: "none" });
        },

        async getPhoneNumber(e) {
            await uni.request({
                url: BaseUrl + "/api/wanlshop.user/phone",
                method: "POST",
                data: {
                    encryptedData: e.detail.encryptedData,
                    iv: e.detail.iv,
                    code: this.code,
                    client_id: uni.getStorageSync("chat_client_id")
                        ? uni.getStorageSync("chat_client_id")
                        : null,
                },
                success: (res) => {
                    console.log("-=-=-=res", res);
                    uni.setStorageSync("userInfo", res.data.data.userinfo);
                    uni.setStorageSync("token", res.data.data.userinfo.token);
                    this.$store.state.user.isLogin = true;
                    //   uni.showToast({
                    //     title: "登录成功",
                    //     icon: "none",
                    //     duration: 1000,
                    //   });
                    //   setTimeout(() => {
                    // uni.navigateBack();
                    uni.navigateTo({
                        url: "/liu/pages/userinfo",
                    });
                    //   }, 1000);
                },
            });
        },
    },
};
</script>
<style lang="scss" scoped>
.login {
    height: 100vh;
    width: 100%;
    padding: 0 50rpx;
    box-sizing: border-box;
    .login_box {
        margin-top: 12vh;
        // height: 350rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        .title {
            font-size: 60rpx;
            color: #000;
            width: 100%;
            padding: 20rpx 0;
            box-sizing: border-box;
        }
        .login_btn {
            width: 100%;
            height: 80rpx;
            line-height: 80rpx;
            background: linear-gradient(90deg, #00a67a, #057748);
            border-radius: 40rpx;
            color: #fff;
        }
    }
}
.radio {
    transform: scale(0.7);
    height: 50rpx;

    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 36rpx;
}

.xieyi {
    color: #057748;
    font-size: 40rpx;
}
</style>
